import { ElMessage, ElNotification } from 'element-plus'
import { dateFormatter1 } from '@/assets/js/main.js'

// 梅花易数起卦API接口
import {
  startsApi, // 开始起卦
  getNowGanZhiApi, // 获取当前日期的干支
  ganZhiToDateApi, // 通过干支获取日期
  isLeapMonthApi //  // 判断日期是否为闰月
} from '@/api/tool/meihuaqigua-api.js'

export default {
  el: 'app',
  data() {
    return {
      // 左侧导航
      navigations: [
        {
          id: 1,
          title: '首页', // 名称
          link: '/', // 路由
          icon: 'ios-home' // 图标
        },
        {
          id: 2,
          title: '辅助工具',
          link: '',
          icon: 'md-color-wand'
        },
        {
          id: 3,
          title: '梅花易数起卦',
          link: '',
          icon: 'md-pin'
        }
      ],
      // 右侧快捷导航
      fasts: [
        {
          id: 1,
          title: '奇门排盘',
          link: '/tool/qm',
          icon: 'ios-open-outline'
        },
        {
          id: 2,
          title: ' 八字排盘', // 名称
          link: '/tool/bz', // 路由
          icon: 'ios-open-outline' // 图标
        },
        {
          id: 3,
          title: '六爻起卦',
          link: '/tool/ly',
          icon: 'ios-open-outline'
        }
      ],
      mark: 'mhysqg', // 二级导航标识

      /* 选项 */
      reLoadingStatus: false, // 重新加载按钮状态（true: 可用。false: 禁用）
      name: '', // 姓名
      occupy: '', // 占事
      sex: 1, // 性别
      sexStr: '男', // 性别
      sexOptions: ['男', '女'],
      date: '', // 日期
      dateType: 0, // 日期类型
      dateTypeStr: '公历', // 日期类型
      dateTypeOptions: ['公历', '农历', '四柱'],
      leapMonth: false, // 是否闰月（true:是。false:否）
      leapMonthStatus: false, // 是否闰月状态（true:可选。false:不可选）
      trueSolar: false, // 是否真太阳时（true:是。false:否）
      address: '110000', // 地区：城市编码
      addressName: '北京市', // 地区：城市名称
      qiGuaMode: 0, // 起卦模式
      qiGuaModeOptions: [
        { value: 0, label: '日期起卦' },
        { value: 1, label: '数字起卦' },
        { value: 2, label: '单数起卦' },
        { value: 3, label: '双数起卦' }
      ],
      number: '', // 数字
      danNumber: '', // 单数
      shuangNumber1: '', // 双数一
      shuangNumber2: '', // 双数二
      shuangNumberInSx: false, //双数计算上下卦（true:双数求和计算上下卦。false:双数不求和计算上下卦）
      shuangNumberInDong: false, // 双数计算动爻（true:双数求和加时辰数计算动爻。false:双数求和计算动爻）
      // 更多选项
      yearGanZhiSet: 1, // 年干支设置
      yearGanZhiSetOptions: [
        { value: 0, label: '以正月初一作为新年的开始' },
        { value: 1, label: '以立春当天作为新年的开始' },
        { value: 2, label: '以立春交接的时刻作为新年的开始' }
      ],
      monthGanZhiSet: 1, // 月干支设置
      monthGanZhiSetOptions: [
        { value: 0, label: '以节交接当天起算' },
        { value: 1, label: '以节交接时刻起算' }
      ],
      dayGanZhiSet: 0, // 日干支设置
      dayGanZhiSetOptions: [
        { value: 0, label: '晚子时日干支算当天' },
        { value: 1, label: '晚子时日干支算明天' }
      ],
      hourGanZhiSet: 0, // 时干支设置
      hourGanZhiSetOptions: [{ value: 0, label: '支持早子时和晚子时' }],
      sixGuaIndex: [5, 4, 3, 2, 1, 0], // 六爻从上至下索引
      dateStatus: true, // 日期可选状态（true:可选。false:不可选）
      resDate: false, // 选项重置时是否同时重置日期（true:是。false:否）

      // 按钮操作
      resettingButtonStatus: true, // 记录是否已点击重置按钮（true:已点击。false:未点击）
      startsButton: true, // 排盘按钮状态（true:启用。false:禁用）

      /* 弹窗 */
      seniorDialog: false,  // 高级选项弹窗
      siZhuDialog: false,  // 四柱转日期弹窗

      /* 数据 */
      data: {}, // 数据
      dataStatus: false, // 初始化数据状态（true:存在。false:不存在）
      dataShiLiStatus: true, // 默认数据显示状态（true:显示。false:隐藏）
      dataShiLiSwitch: false, // 是否允许将默认数据切换为完整数据（true:允许。false:禁止）
      dataAllPage: 1, // 完整数据默认显示的数据

      /* 四柱转日期 */
      siZhuToDateColumns: [
        // 日期表格标题
        { type: 'index', title: '序号', width: 60, align: 'center', resizable: true },
        { title: '公历日期', key: 'solar', width: 150, align: 'center', resizable: true },
        { title: '农历日期', key: 'lunar', width: 200, align: 'center', resizable: true },
        { title: '操作', slot: 'action', align: 'center', resizable: true }
      ],
      siZhuToDate: [], // 日期
      siZhuToDateTotal: 0, // 日期条数
      siZhuButton: true, // 四柱转日期按钮状态（true:启用。false:禁用）
      beginYear: 1900, // 起始年
      beginYear2: 0, // 起始年
      yearGanZhi: null, // 年干支
      monthGanZhi: null, // 月干支
      dayGanZhi: null, // 日干支
      hourGanZhi: null, // 时干支
      ganZhiOptions: [ // 六十甲子
        { value: '甲子', label: '甲子' },
        { value: '甲戌', label: '甲戌' },
        { value: '甲申', label: '甲申' },
        { value: '甲午', label: '甲午' },
        { value: '甲辰', label: '甲辰' },
        { value: '甲寅', label: '甲寅' },
        { value: '乙丑', label: '乙丑' },
        { value: '乙亥', label: '乙亥' },
        { value: '乙酉', label: '乙酉' },
        { value: '乙未', label: '乙未' },
        { value: '乙巳', label: '乙巳' },
        { value: '乙卯', label: '乙卯' },
        { value: '丙寅', label: '丙寅' },
        { value: '丙子', label: '丙子' },
        { value: '丙戌', label: '丙戌' },
        { value: '丙申', label: '丙申' },
        { value: '丙午', label: '丙午' },
        { value: '丙辰', label: '丙辰' },
        { value: '丁卯', label: '丁卯' },
        { value: '丁丑', label: '丁丑' },
        { value: '丁亥', label: '丁亥' },
        { value: '丁酉', label: '丁酉' },
        { value: '丁未', label: '丁未' },
        { value: '丁巳', label: '丁巳' },
        { value: '戊辰', label: '戊辰' },
        { value: '戊寅', label: '戊寅' },
        { value: '戊子', label: '戊子' },
        { value: '戊戌', label: '戊戌' },
        { value: '戊申', label: '戊申' },
        { value: '戊午', label: '戊午' },
        { value: '己巳', label: '己巳' },
        { value: '己卯', label: '己卯' },
        { value: '己丑', label: '己丑' },
        { value: '己亥', label: '己亥' },
        { value: '己酉', label: '己酉' },
        { value: '己未', label: '己未' },
        { value: '庚午', label: '庚午' },
        { value: '庚辰', label: '庚辰' },
        { value: '庚寅', label: '庚寅' },
        { value: '庚子', label: '庚子' },
        { value: '庚戌', label: '庚戌' },
        { value: '庚申', label: '庚申' },
        { value: '辛未', label: '辛未' },
        { value: '辛巳', label: '辛巳' },
        { value: '辛卯', label: '辛卯' },
        { value: '辛丑', label: '辛丑' },
        { value: '辛亥', label: '辛亥' },
        { value: '辛酉', label: '辛酉' },
        { value: '壬申', label: '壬申' },
        { value: '壬午', label: '壬午' },
        { value: '壬辰', label: '壬辰' },
        { value: '壬寅', label: '壬寅' },
        { value: '壬子', label: '壬子' },
        { value: '壬戌', label: '壬戌' },
        { value: '癸酉', label: '癸酉' },
        { value: '癸未', label: '癸未' },
        { value: '癸巳', label: '癸巳' },
        { value: '癸卯', label: '癸卯' },
        { value: '癸丑', label: '癸丑' },
        { value: '癸亥', label: '癸亥' }
      ],
      yearGanZhi2: null, // 年干支
      monthGanZhi2: null, // 月干支
      dayGanZhi2: null, // 日干支
      hourGanZhi2: null // 时干支
    }
  },
  watch: {
    // 姓名监听
    name(val) {
      if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
    },
    // 占事监听
    occupy(val) {
      if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
    },
    // 性别监听
    sexStr(val) {
      if (val === '男') {
        this.sex = 1;
        // this.initializeData(); // 初始化数据
        this.data.sex = '男';
      } else if (val === '女') {
        this.sex = 0;
        // this.initializeData(); // 初始化数据
        this.data.sex = '女';
      }

    },
    // 日期类型监听
    dateTypeStr(val) {
      if (val === '公历') {
        this.dateType = 0;
        this.leapMonth = false; // 取消闰月
        this.leapMonthStatus = false; // 禁用闰月选项
        if (this.resettingButtonStatus) this.initializeData(); // 初始化数据
        // this.notification('success', 800, '', '日期类型已转为：<b>' + this.dateTypeStr + '<b/>');
      } else if (val === '农历') {
        this.dateType = 1;
        this.isLeapMonth(); // 判断日期是否为闰月
        if (this.resettingButtonStatus) this.initializeData(); // 初始化数据
        // this.notification('success', 800, '', '日期类型已转为：<b>' + this.dateTypeStr + '<b/>');
      } else if (val === '四柱') {
        // this.dateType = 2;
        this.leapMonth = false; // 取消闰月
        this.leapMonthStatus = false; // 禁用闰月选项
        this.getNowGanZhi(); // 获取当前日期干支
        // this.notification('success', 800, '', '日期类型已转为：<b>' + this.dateTypeStr + '<b/>');
      }
    },
    // 日期监听
    date(val) {
      if (this.dateTypeStr === '农历') {
        this.isLeapMonth(); // 判断日期是否为闰月
      }
      // this.initializeData(); // 初始化数据
    },
    // 真太阳时选项监听
    trueSolar(val) {
      if (!val) {
        this.address = '110000' // 重置城市编码
        this.addressName = '北京市' // 重置城市名称
      }
    },
    // 闰月监听
    leapMonth(val) {
      if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
    },
    // 地区监听
    addressName(val) {
      // if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
    },
    // 起卦模式监听
    qiGuaMode(val) {
      if (val === 0) {
        if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
        this.dateStatus = true;
      } else {
        this.dateStatus = false;
      }
    },
    // 数字监听
    number(val) {
      if (String(val).length === 3) {
        if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
      }
    },
    // 单数监听
    danNumber(val) {
      if (String(val).length !== 0 && val !== '') {
        if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
      }
    },
    // 双数一监听
    shuangNumber1(val) {
      if (val !== '' && this.shuangNumber2 !== '') {
        this.dateStatus = true;
        if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
      } else {
        this.dateStatus = false;
      }
    },
    // 双数二监听
    shuangNumber2(val) {
      if (val !== '' && this.shuangNumber1 !== '') {
        this.dateStatus = true;
        if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
      } else {
        this.dateStatus = false;
      }
    },
    // 双数计算上下卦监听
    shuangNumberInSx(val) {
      if (this.qiGuaMode === 3 && this.shuangNumber1 !== '' && this.shuangNumber2 !== '') {
        if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
      }
    },
    // 双数计算动爻监听
    shuangNumberInDong(val) {
      if (this.qiGuaMode === 3 && this.shuangNumber1 !== '' && this.shuangNumber2 !== '') {
        if (this.resettingButtonStatus) {
          this.dateStatus = val;
        }
      }
    },
    // 年干支设置监听
    yearGanZhiSet(val) {
      if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
    },
    // 月干支设置监听
    monthGanZhiSet(val) {
      if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
    },
    // 日干支设置监听
    dayGanZhiSet(val) {
      if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
    },
    // 时干支设置监听
    hourGanZhiSet(val) {
      if (this.resettingButtonStatus) this.initializeData(); // ★ 初始化数据
    },
    // 起始年监听
    beginYear(val) {
      if (val <= 0 || val === '') {
        this.beginYear = 1;
      } else if (val > 9999) {
        this.beginYear = 9999;
      }
    },
    // 四柱转日期弹窗监听
    siZhuDialog(val) {
      if (!val) {
        // 日期类型转为公历
        this.dateType = 0;
        this.dateTypeStr = '公历';
      }
    }
  },
  created() {
    this.date = new Date() // 初始化日期
    this.initializeData(); // 初始化数据
  },
  mounted() {
  },
  methods: {

    /* 数据区域操作 */

    /**
     * ★ 初始化数据
     */
    initializeData() {

      this.reLoadingStatus = false; // 禁用重新加载按钮

      // 构造条件
      let query = {
        name: this.name == '' ? '缘主' : this.name, // 姓名
        occupy: this.occupy == '' ? '' : this.occupy, // 占事
        sex: this.sex, // 性别
        date: this.date, // 日期
        dateType: this.dateType, // 日期类型
        address: this.addressName, // 地区名称
        leapMonth: this.leapMonth === true ? 1 : 0, // 是否闰月
        qiGuaMode: this.qiGuaMode, // 起卦模式
        qiGuaNumber: this.number, // 数字
        qiGuaDanNumber: this.danNumber, // 单数
        qiGuaShuangNumber1: this.shuangNumber1, // 双数一
        qiGuaShuangNumber2: this.shuangNumber2, // 双数二
        qiGuaShuangNumberInSx: this.shuangNumberInSx ? 0 : 1, // 双数求和取上下卦（true:双数求和计算上下卦。false:双数不求和计算上下卦）
        qiGuaShuangNumberInDong: this.shuangNumberInDong ? 1 : 0, // 双数计算动爻（true:双数求和加时辰数计算动爻。false:双数求和计算动爻）
        yearGanZhiSet: this.yearGanZhiSet, // 年干支设置
        monthGanZhiSet: this.monthGanZhiSet, // 月干支设置
        dayGanZhiSet: this.dayGanZhiSet, // 日干支设置
        hourGanZhiSet: this.hourGanZhiSet // 时干支设置
      }

      // 发送请求
      startsApi(query).then((res) => {
        if (String(res.data.code) == '200' && null != res.data.data) {
          let data = res.data.data;

          this.data = data;

          this.startsButton = true; // 启用排盘按钮
          this.reLoadingStatus = true; // 启用重新加载按钮
          this.dataStatus = true; // 初始化数据状态（true:存在。false:不存在）
          this.dataShiLiSwitch = true; // 是否允许将默认数据切换为完整数据（true:允许。false:禁止）
        } else {
          this.startsButton = true; // 启用排盘按钮
          this.reLoadingStatus = true; // 启用重新加载按钮
          this.dataShiLiSwitch = false; // 是否允许将默认数据切换为完整数据（true:允许。false:禁止）
        }
      }).catch(() => {
        this.startsButton = true; // 启用排盘按钮
        this.reLoadingStatus = true; // 启用重新加载按钮
        this.dataShiLiSwitch = false; // 是否允许将默认数据切换为完整数据（true:允许。false:禁止）
      })

    },

    /**
     * ★ 开始起卦
     */
    starts() {

      // 判断是否允许切换完整数据
      if (this.dataShiLiSwitch) {
        this.dataAllPage = 1; // 重置为默认显示数据
        this.dataShiLiStatus = false; // 切换为完整数据
      } else {
        this.initializeData(); // 初始化数据
      }

    },

    /**
     * 获取当前日期干支
     */
    getNowGanZhi() {

      // 构造条件
      let query = {
        date: new Date(), // 日期
        yearGanZhiSet: this.yearGanZhiSet, // 年干支设置
        monthGanZhiSet: this.monthGanZhiSet, // 月干支设置
        dayGanZhiSet: this.dayGanZhiSet, // 日干支设置
        hourGanZhiSet: this.hourGanZhiSet // 时干支设置
      }

      // 发送请求
      getNowGanZhiApi(query).then((res) => {
        if (String(res.data.code) === '200') {
          if (null !== res.data.data) {
            this.beginYear = 1900;
            this.yearGanZhi = res.data.data[0];
            this.monthGanZhi = res.data.data[1];
            this.dayGanZhi = res.data.data[2];
            this.hourGanZhi = res.data.data[3];
            this.yearGanZhi2 = res.data.data[0];
            this.monthGanZhi2 = res.data.data[1];
            this.dayGanZhi2 = res.data.data[2];
            this.hourGanZhi2 = res.data.data[3];
            this.siZhuDialog = true; // 显示四柱转日期弹窗
            if (!this.siZhuDialog) {
              // 若四柱转日期弹窗未显示，则将日期类型转为公历
              this.dateType = 0;
              this.dateTypeStr = '公历';
            }
          }
        }
      }).catch(() => {
        this.dateType = 0; // 日期类型转为公历
        this.dateTypeStr = '公历'; // 日期类型转为公历
      })

    },

    /**
     * 通过四柱获取日期
     */
    getSiZhuToDate() {

      // 构造条件
      let query = {
        beginYear: this.beginYear, // 起始年份
        yearGanZhi: this.yearGanZhi, // 年干支
        monthGanZhi: this.monthGanZhi, // 月干支
        dayGanZhi: this.dayGanZhi, // 日干支
        hourGanZhi: this.hourGanZhi, // 时干支
        yearGanZhiSet: this.yearGanZhiSet, // 年干支设置
        monthGanZhiSet: this.monthGanZhiSet, // 月干支设置
        dayGanZhiSet: this.dayGanZhiSet, // 日干支设置
        hourGanZhiSet: this.hourGanZhiSet // 时干支设置
      }
      this.beginYear2 = this.beginYear;
      this.siZhuButton = true;

      // 发送请求
      ganZhiToDateApi(query).then((res) => {
        if (String(res.data.code) === '200') {
          if (null !== res.data.data) {
            if (res.data.data.length !== 0) {
              this.siZhuToDate = res.data.data;
              this.siZhuToDateTotal = res.data.data.length;
              this.siZhuButton = true;
            } else {
              this.siZhuToDate = {};
              this.siZhuToDateTotal = 0;
              this.siZhuButton = true;
              this.elMessage(3000, true, 'warning', '没有和【' + this.yearGanZhi + ' ' + this.monthGanZhi + ' ' + this.dayGanZhi + ' ' + this.hourGanZhi + '】相匹配的日期');
            }
          }
        } else {
          this.siZhuToDate = {};
          this.siZhuToDateTotal = 0;
          this.elMessage(3000, true, 'error', res.data.msg || '操作失败');
        }
      }).catch(() => {
        this.siZhuToDate = {};
        this.siZhuToDateTotal = 0;
        // this.elMessage(3000, true, 'error', '操作失败');
      })

    },

    /**
     * 设置新日期
     * 
     * @param {string} newDate 公历日期
     */
    setNewDate(newDate) {

      this.date = dateFormatter1(newDate);
      this.siZhuDialog = false; // 关闭四柱转日期弹窗
      this.elMessage(3000, true, 'success', '日期已设置');

    },

    /**
     * 判断日期是否为闰月
     */
    isLeapMonth() {

      // 条件构造
      let query = {
        date: this.date, // 日期
      }

      // 发送请求
      isLeapMonthApi(query).then((res) => {
        if (String(res.data.code) === '200') {
          var data = res.data.data;
          if (null !== data) {
            this.leapMonthStatus = data; // 否闰月状态（true: 可选。false: 不可选）
          }
        }
      })

    },
    //****************************************************************************************

    /* 选项区域操作 */

    /**
     * 获取地区名称
     * 
     * @param {list} data 地区数据集合
     */
    getAddressName(data) {

      this.addressName = data.n

    },

    /**
     * 重置选项
     */
    resetting() {

      this.resettingButtonStatus = false; // 记录是否已点击重置按钮（true:已点击。false:未点击）

      var isFlag = (
        this.name !== '' ||
        this.occupy !== '' ||
        this.sexStr !== '男' ||
        // this.date !== new Date() ||
        this.dateTypeStr !== '公历' ||
        this.leapMonth !== false ||
        this.leapMonthStatus !== false ||
        this.trueSolar !== false ||
        this.address !== '110000' ||
        this.addressName !== '北京市' ||
        this.qiGuaMode !== 0 ||
        this.number !== '' ||
        this.danNumber !== '' ||
        this.shuangNumber1 !== '' ||
        this.shuangNumber2 !== '' ||
        this.shuangNumberInSx !== false ||
        this.shuangNumberInDong !== false ||
        this.yearGanZhiSet !== 1 ||
        this.monthGanZhiSet !== 1 ||
        this.dayGanZhiSet !== 1 ||
        this.hourGanZhiSet !== 0
      );

      if (isFlag) {
        this.name = '' // 姓名
        this.occupy = '' // 占事
        this.sexStr = '男' // 性别
        // this.date = new Date() // 日期
        this.dateTypeStr = '公历' // 日期类型
        this.leapMonth = false // 是否闰月
        this.leapMonthStatus = false; // 是否闰月状态
        this.trueSolar = false // 是否真太阳时
        this.address = '110000' // 地区：城市编码
        this.addressName = '北京市' // 地区：城市名称
        this.qiGuaMode = 0 // 起卦模式
        this.number = '' // 数字
        this.danNumber = '' // 单数
        this.shuangNumber1 = '' // 双数一
        this.shuangNumber2 = '' // 双数二
        this.shuangNumberInSx = false // 双数求和取上下卦（true:双数求和计算上下卦。false:双数不求和计算上下卦）
        this.shuangNumberInDong = false // 双数求和取动爻（true:双数求和计算动爻。false:双数求和加时数计算动爻）
        this.yearGanZhiSet = 1 // 年干支设置
        this.monthGanZhiSet = 1 // 月干支设置
        this.dayGanZhiSet = 1 // 日干支设置
        this.hourGanZhiSet = 0 // 时干支设置
        this.notification('success', 1000, '', '选项已全部重置');
      } else {
        // this.notification('warning', 1000, '', '选项未更改');
      }

      // 是否重置日期
      if (this.resDate) this.date = new Date();

      this.dateStatus = true;
      this.resettingButtonStatus = true; // 记录是否已点击重置按钮（true:已点击。false:未点击）
      if (isFlag) this.initializeData(); // ★ 初始化数据

    },

    /**
     * 占事功能提示
     */
    occupyPrompt() {

      this.notification('info', 1500, '', '该功能正在完善中，暂未提供相关解读');

    },

    /**
     * 更多功能提示
     */
    gengduoPrompt() {

      this.notification('info', 1500, '', '更多数据正在完善中，敬请期待~');

    },

    //****************************************************************************************

    /* 通用方法  */

    /**
     * 五行颜色
     * 
     * @param {string} wuXing 五行（两个）
     */
    wxc(wuXing) {

      let w1 = wuXing.substring(0, 1) // 五行1
      let w2 = wuXing.substring(1, 2) // 五行2
      let newW = '' // 新五行

      if ('木' === w1) {
        w1 = wuXing.replace(wuXing, '<font color="#07DA30">' + w1 + '</font>');
      }
      if ('火' === w1) {
        w1 = wuXing.replace(wuXing, '<font color="#d30505">' + w1 + '</font>');
      }
      if ('土' === w1) {
        w1 = wuXing.replace(wuXing, '<font color="#8b6d03">' + w1 + '</font>');
      }
      if ('金' === w1) {
        w1 = wuXing.replace(wuXing, '<font color="#ef9104">' + w1 + '</font>');
      }
      if ('水' === w1) {
        w1 = wuXing.replace(wuXing, '<font color="#2e83f6">' + w1 + '</font>');
      }

      if ('木' === w2) {
        newW = w1 + wuXing.replace(wuXing, '<font color="#07DA30">' + w2 + '</font>');
      }
      if ('火' === w2) {
        newW = w1 + wuXing.replace(wuXing, '<font color="#d30505">' + w2 + '</font>');
      }
      if ('土' === w2) {
        newW = w1 + wuXing.replace(wuXing, '<font color="#8b6d03">' + w2 + '</font>');
      }
      if ('金' === w2) {
        newW = w1 + wuXing.replace(wuXing, '<font color="#ef9104">' + w2 + '</font>');
      }
      if ('水' === w2) {
        newW = w1 + wuXing.replace(wuXing, '<font color="#2e83f6">' + w2 + '</font>');
      }

      return newW;

    },

    //****************************************************************************************

    /**
     * 消息提示
     * 
     * @param {number} duration 显示时间（单位：毫秒）
     * @param {boolean} showClose 是否可关闭（true:是。false:否）
     * @param {string} type 消息类型（success、warning、error）
     * @param {string} message 提示内容
     */
    elMessage(duration, showClose, type, message) {
      ElMessage({
        duration: duration,
        showClose: showClose,
        type: type,
        message: message,
        plain: true
      })
    },

    /**
     * 通知提示（右下角弹出）
     * 
     * @param {string} type 消息类型（success、warning、error）
     * @param {number} duration 自动关闭延迟，0为不关闭（单位：毫秒）
     * @param {string} title 标题
     * @param {string} message 提示内容
     */
    notification(type, duration, title, message) {
      ElNotification({
        type: type,
        title: title,
        message: message,
        duration: duration,
        position: 'top-right',
        dangerouslyUseHTMLString: true
      })
    }

  }
}
